// 执行分页，生成页面数据，能根据全局变量实时更改页面效果
function generatePage() {

    // 1.获取分页数据
    let pageInfo = getPageInfoRemote();

    // 2.用分页数据填充表格
    fillTableBody(pageInfo);

    // 重置全选box
    $("#mainBox_role").prop("checked", false);
}

// 远程访问服务器端程序获取pageInfo数据
function getPageInfoRemote() {

    // 发送ajax请求
    let ajaxResult = $.ajax({
        "url": "role/get/roleList.json",
        "type": "post",

        // 发送数据的格式是form/data
        "data": {
            "pageNum": window.pageNum,
            "pageSize": window.pageSize,
            "keyword": window.keyword
        },
        "async": false, // 禁止异步
        "dataType": "json", // 处理返回的数据的方式
    });


    // 判断当前响应状态码是否是200
    let status = ajaxResult.status;
    if (status !== 200) {

        // 出现响应异常
        layer.msg("failed! " + status + " , " + ajaxResult.statusText);
        return null;
    }

    // 响应码200,成功响应
    let resultEntity = ajaxResult.responseJSON;
    let result = resultEntity.result;
    let message = resultEntity.message

    // 判断resultEntity是否成功返回数据
    if (result === "SUCCESS") {
        return resultEntity.data;
    } else if (result === "FAILED") {
        return null;
    }

}

// 填充表格
function fillTableBody(pageInfo) {

    // 填充前必须先清空表格和导航栏内容
    $("#rolePageBody").empty();
    $("#Pagination").empty();

    // 判空
    if (pageInfo === null
        || pageInfo === undefined
        || pageInfo.list === null
        || pageInfo.list.length === 0
    ) {
        $("#rolePageBody").append("<tr><td colspan='4' align='center'>NO DATA WAS FOUND</td></tr>");
    }

    // 拼接html代码
    for (let i = 0; i < pageInfo.list.length; i++) {
        let role = pageInfo.list[i];
        let role_name = role.roleName;
        let role_id = role.id;

        // tr = td1 + td2 +td3 +td4

        // td1
        let numberTd = "<td>" + (i + 1) + "</td>>";

        // td2
        let checkBoxTd = "<td><input id='" + role_id + "' class='checkbox_role' type='checkbox'></td>";

        // td3
        let roleNameTd = "<td>" + role_name + "</td>>";

        let checkBtn = "<button id='" + role_id + "' type='button' class='btn btn-success btn-xs checkBoxBtn_role'><i class='glyphicon glyphicon-check'></i></button>";
        let pencilBtn = "<button id='" + role_id + "' type='button' class='btn btn-primary btn-xs toUpdateModalBtn'><i class='glyphicon glyphicon-pencil'></i></button>";
        let removeBtn = "<button id='" + role_id + "' type='button' class='btn btn-danger btn-xs toDeleteMadel'><i class='glyphicon glyphicon-remove'></i></button>";

        // td4
        let btnTd = "<td>" + checkBtn + " " + pencilBtn + " " + removeBtn + "</td>"

        let tr = "<tr>" + numberTd + checkBoxTd + roleNameTd + btnTd + "</tr>"

        // 完成拼接
        $("#rolePageBody").append(tr);

        // 调用函数生成页码导航条
        generateNavigator(pageInfo);
    }
}

// 生成页码导航条
function generateNavigator(pageInfo) {

    // 获取总记录数
    let totalRecord = pageInfo.total;

    // 声明相关属性
    let properties = {

        // 边缘页的页数
        "num_edge_entries": 1,

        // 中间显示页数
        "num_display_entries": 2,

        // 回调函数
        "callback": paginationCallBack,

        // 每页显示数据的条数
        "items_per_page": pageInfo.pageSize,

        // 当前页
        "current_page": pageInfo.pageNum - 1,

        // 上一页
        "prev_text": "<<",

        // 下一页
        "next_text": ">>",

    }

    // 调用pagination的初始化函数
    $("#Pagination").pagination(totalRecord, properties)
}

// 回调函数
function paginationCallBack(pageIndex, jQuery) {

    // 修改一下全局变量的pageNum
    window.pageNum = pageIndex + 1;

    // 调用分页函数
    generatePage();

    // 取消页码超链接的默认行为
    return false;
}

function openDeleteMadel(roleList) {

    // 打开模态框
    $("#deleteRoleModal").modal("show");

    $("#roleNameSpan").empty();

    window.roleIdList = [];

    // 遍历roleList数组
    for (let i = 0; i < roleList.length; i++) {
        let role = roleList[i];
        let roleName = role.roleName;
        let roleId = role.roleId;
        $("#roleNameSpan").append(roleName + "<br/>");
        window.roleIdList.push(roleId);
    }
}

// 声明专门的函数用来在分配 Auth 的模态框中显示 Auth 的树形结构数据
function fillAuthTree() {
    // 1.发送 Ajax 请求查询 Auth 数据
    let ajaxReturn = $.ajax({
        "url": "assign/get/allAuth.json",
        "type": "post",
        "dataType": "json",
        "async": false
    });
    if (ajaxReturn.status !== 200) {
        layer.msg(ajaxReturn.status + " " + ajaxReturn.statusText);
        return;
    }
    // 2.从响应结果中获取 Auth 的 JSON 数据
    // 从服务器端查询到的 list 不需要组装成树形结构，这里我们交给 zTree 去组装
    let authList = ajaxReturn.responseJSON.data;
    // 3.准备对 zTree 进行设置的 JSON 对象
    let setting = {
        "data": {
            "simpleData": {
                // 开启简单 JSON 功能
                "enable": true,
                // 使用 categoryId 属性关联父节点，不用默认的 pId 了
                "pIdKey": "categoryId"
            },
            "key": {
                // 使用 title 属性显示节点名称，不用默认的 name 作为属性名了
                "name": "title"
            }
        },
        "check": {
            "enable": true
        }
    };
    // 4.生成树形结构
    // <ul id="authTreeDemo" class="ztree"></ul>
    $.fn.zTree.init($("#authTreeDemo"), setting, authList);
    // 获取 zTreeObj 对象
    let zTreeObj = $.fn.zTree.getZTreeObj("authTreeDemo");
    // 调用 zTreeObj 对象的方法，把节点展开
    zTreeObj.expandAll(true);
    // 5.查询已分配的 Auth 的 id 组成的数组 todo
    console.log(window.roleId)
    ajaxReturn = $.ajax({
        "url": "assign/get/assignedAuthId.json",
        "type": "post",
        "data": {
            "roleId": window.roleId
        },
        "dataType": "json",
        "async": false
    });
    if (ajaxReturn.status !== 200) {
        layer.msg(ajaxReturn.status + " " + ajaxReturn.statusText);
        return;
    }
    // todo
    console.log(ajaxReturn)
    // 从响应结果中获取 authIdArray
    let authIdArray = ajaxReturn.responseJSON.data;
    // 6.根据 authIdArray 把树形结构中对应的节点勾选上
    // ①遍历 authIdArray
    for (let i = 0; i < authIdArray.length; i++) {
        let authId = authIdArray[i];
        // ②根据 id 查询树形结构中对应的节点
        let treeNode = zTreeObj.getNodeByParam("id", authId);
        // ③将 treeNode 设置为被勾选
        // checked 设置为 true 表示节点勾选
        let checked = true;
        // checkTypeFlag 设置为 false，表示不“联动”，不联动是为了避免把不该勾选的勾选上
        let checkTypeFlag = false;
        // 执行
        zTreeObj.checkNode(treeNode, checked, checkTypeFlag);
    }
}